import Taro, { Component } from '@tarojs/taro';
import { View, Image } from '@tarojs/components';
import { DNavBar, DCheckOpinion, DLookImages } from '@/components';
import { handleIdCard, handlePhone } from '@/utils'
import './index.scss';
import http from '@/api'
export default class PersonCheckDetail extends Component {
  state = {
    moneyIcon: require('@/assets/images/money_icon.png'),
    fileIcon: require('@/assets/images/file_icon.png'),
    authStatus:{
      1: '审核中',
      2: '认证通过',
      3: '认证不通过',
      4: '禁用'
    },//个人认证状态
    opinions: [{
      name: '审核通过',
      value: 'success'
    }, {
      name: '审核不通过',
      value: 'fail'
    }],
    previewImg: {
      itemStatus: false,
      itemUrl: ''
    },
	personDetail:{creator:'',imName:''},
  }
  componentDidMount() {
    this.getPersonalAuthInfo()
  }
  handleCancel(){
	  // Taro.navigateTo({
		 //  url:'/pages/personCheck'
	  // })
  }
  handleConfirm(state){
	  let {personDetail} = this.state
	  http.personReview({
		  id:personDetail.id,
		  authStatus:state.checkOpinion=='fail'?3:2,
		  authDesc:state.explain
	  }).then(data=>{
			  Taro.navigateTo({
			  		  url:'/pages/personCheck?tab=9'
			  })


	  })

  }
  getPersonalAuthInfo() {
    const { id } = this.$router.params
    http.getPersonalAuthInfo({ id }).then((personDetail) => {
      // this.handleDetailData(detail)
      this.setState({ personDetail })
    })
  }
  // 图片预览
  onLookHandle(url) {
    if (window.bridge) {
      let _images = [], i = 0
      _images.push(url)
      window.bridge.callHandler('previewPhoto', { "index": i, "images": _images }, function responseCallback() { })
    } else {
      this.setState({
        previewImg: {
          itemStatus: true,
          itemUrl: url
        }
      })
    }
  }
  onLookItem() {
    this.setState({
      previewImg: {
        ...this.state.previewImg,
        itemStatus: false,
        itemUrl: ''
      }
    })
  }

  render() {
    const { opinions,personDetail, previewImg  } = this.state;

    return (
      <View className="mortgage-check-detail">
        <DNavBar title="个人认证审核详情"></DNavBar>

        <View className={['status_bar', personDetail.authStatus == 2 ? 'pass' : 'no-pass'].join(' ')}>{this.state.authStatus[+personDetail.authStatus]}</View>

         <View className="info">
          <View className="item">
            <View className="label">申请账号</View>
            <View className="value">{personDetail.creator}</View>
          </View>
          <View className="item">
            <View className="label">姓名</View>
            <View className="value">{personDetail.imName}</View>
          </View>

          <View className="item">
            <View className="label">身份证号码</View>
            <View className="value">{personDetail.imCard}</View>
          </View>
          <View className="item">
            <View className="label">手机号码</View>
            <View className="value">{personDetail.imPhone}</View>
          </View>
          <View className="item">
            <View className="label">身份证照片</View>
             <View className="value">
              <Image className="photo" src={personDetail.imIdcardBakUrl} onClick={this.onLookHandle.bind(this, personDetail.imIdcardBakUrl)}></Image>
              <Image className="photo" src={personDetail.imIdcardUrl} onClick={this.onLookHandle.bind(this, personDetail.imIdcardUrl)}></Image>
            </View>
          </View>
        </View>

        {
          (personDetail.authStatus == 2 || personDetail.authStatus == 3) && <View className="check-detail">
          <View className="check-detail__title">审核</View>
          <View className="item">
            <View className="label">审核操作</View>
            <View className="value">{ { 2: '审核通过', 3: '审核不通过' }[personDetail.authStatus] }</View>
          </View>
          <View className="item">
            <View className="label">审核意见</View>
            <View className="value">{ personDetail.authDesc || '---' }</View>
          </View>
          <View className="item">
            <View className="label">审核时间</View>
            <View className="value">{ personDetail.authTime || '---' }</View>
          </View>
        </View>
        }

        {
          personDetail.authStatus == 1 &&
            <View>
              <View className="border"></View>
              <DCheckOpinion opinions={opinions} onCancel={this.handleCancel.bind(this)} onConfirm={this.handleConfirm.bind(this)} checkOpinion={+personDetail.authStatus==2?'success':'fail'} explain={personDetail.authDesc}/>
            </View>
        }

        <DLookImages status={previewImg.itemStatus} url={previewImg.itemUrl} onLookHandle={this.onLookItem.bind(this)}></DLookImages>

      </View>
    )
  }
}
